div{
	height: 300px;
	width: 300px;
	display: block;
	float: left;
	margin: 0 0 10px 10px;
}
.blue-linear {
	background: repeating-linear-gradient(30deg, #79b, #79b 15px, #58a 0, #58a 30px);
}
.line-linear {
	background: -webkit-linear-gradient(top, #fb3 30%, #58a);
	background-size: 100% 30px;
}
.square-linear {
	background: -webkit-linear-gradient(45deg, #fb3 50%, #58a 0);
	background-size: 30px 30px;
}
.repeating-linear{
	background: -webkit-repeating-linear-gradient(30deg, #fb3, #fb3 15px, #58a 0, #58a 30px);
}
.three-linear {
	background: -webkit-linear-gradient(#fb3 33.3%, #58a 0, #58a 66.6%, yellowgreen 0);
	background-size: 100% 45px;
}




.to-bottom-linear{
	background: -webkit-linear-gradient(top, #fb3 10%, #58a 90%);
}
.to-right-linear{
	background: -webkit-linear-gradient(right, #fb3, #58a);
}
